<template>
	<view class="page">
		<view class="order" v-for="one in list" :key="one">
			<view class="line-1">
				<text>订单号：{{one.code}}</text>
				<text>{{one.status}}</text>
			</view>
			<view class="line-2">
				<text>假设这里是商品简要信息</text>
			</view>
			<view class="line-3">
				<text>金额：{{one.amount}}元</text>
				<button class="pay-btn" type="primary" v-if="one.status=='未付款'" @tap="pay(one.id)">付款</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: []
			}
		},
		methods: {
			pay: function(id) {
				let that = this
				let platform = uni.getSystemInfoSync().platform
				if (platform == 'android') {
					uni.request({
						url: that.url.zfb.appPayOrder,
						method: "POST",
						header: {
							"token": uni.getStorageSync("token")
						},
						data: {
							"orderId": id
						},
						success: function(resp) {
							let orderString = resp.data.orderString
							const jyAliPay = uni.requireNativePlugin('JY-ALIPAY')
							jyAliPay.show({ // 发起支付
								if_sanbox: true,
								auto_create_order_info: false,
								appid: that.zfb.app.appid,
								rsa2_private: that.zfb.app.privateKey,
								order_info: orderString
							}, function(result) { // 支付完成回调
								// console.log(result)
								if (result.resultStatus == '9000') {
									uni.showToast({
										title: "付款成功"
									})
									uni.request({
										url: that.url.zfb.updateOrderStatus,
										method: "POST",
										header: {
											"token": uni.getStorageSync("token")
										},
										data: {
											"orderId": id
										},
										success: function(resp) {
											that.loadData()
										}
									})
								} else {
									uni.showToast({
										title: "付款失败",
										icon: "none"
									})
								}
							});
							// uni.requestPayment({
							// 	provider:"alipay",
							// 	orderInfo:orderString,
							// 	success:function(){

							// 	},
							// 	fail:function(){

							// 	}
							// })
						}
					})
				} else {
					uni.getProvider({
						service: "payment",
						success: function(resp) {
							console.log(resp)


							let provider = resp.provider[0]
							if (provider == "weixin") {
								uni.request({
									url: that.url.wx.microAppPayOrder,
									method: "POST",
									header: {
										"token": uni.getStorageSync("token")
									},
									data: {
										"orderId": id
									},
									success: function(resp) {
										console.log("创建订单后返回参数：" + JSON.stringify(resp))
										let timeStamp = resp.data.timeStamp
										let nonceStr = resp.data.nonceStr
										let pk = resp.data.package
										let paySign = resp.data.paySign

										uni.requestPayment({
											"timeStamp": timeStamp,
											"nonceStr": nonceStr,
											"signType": "MD5",
											"package": pk,
											"paySign": paySign,
											success: function(resp) {
												console.log("支付成功：" + JSON.stringify(resp))
												uni.showToast({
													title: "支付成功"
												})
												//主动发起请求
												uni.request({
													url: that.url.wx.updateOrderStatus,
													method: "POST",
													header: {
														"token": uni.getStorageSync("token")
													},
													data: {
														"orderId": id
													},
													success: function(resp) {
														console.log("更新订单状态成功")
														let pages = getCurrentPages()
														let page = pages[pages.length - 1]
														page.onShow()
													},
													fail: function() {
														console.log("更新订单状态失败")
													}
												})
											},
											fail: function(resp) {

												console.log("支付失败原因：" + JSON.stringify(resp))
												uni.showToast({
													title: "支付失败"
												})
											}
										})
									},
									fail: function(resp) {
										console.log(resp);
										uni.showToast({
											title: "创建支付订单失败！"
										})
									}
								})
							} else if (provider == 'alipay') {
								uni.request({
									url: that.url.zfb.microAppPayOrder,
									method: "POST",
									header: {
										"token": uni.getStorageSync("token")
									},
									data: {
										"orderId": id
									},
									success: function(resp) {
										console.log("创建订单后返回参数：" + JSON.stringify(resp))
										let prepayId = resp.data.prepayId


										uni.requestPayment({
											provider: "alipay",
											orderInfo: prepayId,
											success: function(resp) {
												console.log("支付成功：" + JSON.stringify(resp))
												uni.showToast({
													title: "支付成功"
												})
												主动发起请求
												uni.request({
													url: that.url.zfb.updateOrderStatus,
													method: "POST",
													header: {
														"token": uni.getStorageSync("token")
													},
													data: {
														"orderId": id
													},
													success: function(resp) {
														console.log("更新订单状态成功")
														let pages = getCurrentPages()
														let page = pages[pages.length - 1]
														page.onShow()
													},
													fail: function() {
														console.log("更新订单状态失败")
													}
												})

											},
											fail: function(resp) {

												console.log("支付失败原因：" + JSON.stringify(resp))
												uni.showToast({
													title: "支付失败"
												})
											}
										})
									},
									fail: function(resp) {
										console.log(resp);
										uni.showToast({
											title: "创建支付订单失败！"
										})
									}
								})
							}
						}

					})
				}
			},
			loadData: function() {
				let that = this;
				uni.request({
					url: that.url.searchUserOrderList,
					method: "POST",
					header: {
						"token": uni.getStorageSync("token")
					},
					data: {
						"page": 1,
						"length": 20
					},
					success: function(resp) {
						console.log(resp);
						console.log(resp)
						let list = resp.data.list
						for (let one of list) {
							if (one.status == 1) {
								one.status = "未付款"
							} else if (one.status == 2) {
								one.status = "已付款"
							} else if (one.status == 3) {
								one.status = "已发货"
							} else if (one.status == 4) {
								one.status = "已签收"
							}
							one.code = one.code.substr(0, 16)
						}
						that.list = list
					}
				})
			}
		},

		onShow: function() {
			this.loadData()
		}
	}
</script>

<style>
	.page {
		padding: 10px;
	}

	.order {
		padding: 10px;
		border-bottom: solid 1px #e0e0e0;
		font-size: 16px;
	}

	.line-1 {
		display: flex;
		justify-content: space-between;
		padding-bottom: 5px;
	}

	.line-2 {
		padding-bottom: 5px;
	}

	.line-3 {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
	}

	.pay-btn {
		margin: 0;
		font-size: 14px;
		min-width: 80px;
		line-height: 35px;
		height: 35px;
		border: none;
	}
</style>
